import { useEffect, useState } from "react";
import Toolbar from "./toolbar";
import { Layout } from "antd";
// @ts-expect-error jscode
import init from "@/libs/init";
import MprPage from "./page";
import type { MprDataProps } from "./types";

const { Header, Content } = Layout;

const MprLayout: React.FC<MprDataProps> = ({ data }: MprDataProps) => {
  const [inited, setInited] = useState(false);
  useEffect(() => {
    const initCS = async () => {
      await init();
      setInited(true);
    };
    initCS();
  }, []);

  return (
    inited && (
      <Layout className="w-full h-full">
        <Header className="flex items-center justify-center !h-[42px]">
          <Toolbar></Toolbar>
        </Header>
        <Content>
          <MprPage data={data} />
        </Content>
      </Layout>
    )
  );
};

export default MprLayout;
